@extends('layouts.default')
@section('content') 
<div class="col-lg-6">
    <div class="demo-section k-content">
        <div id="chart"></div>
    </div>
    <div class="alert alert-warning">
        W - {{Lang::get('rentals.in_work')}}<br/>
        A - {{Lang::get('rentals.active_vehicles')}}<br/>
        R - {{Lang::get('rentals.rezerved_vehicles')}}<br/>
        O - {{Lang::get('rentals.online')}}
    </div>
    <hr>
</div>
<div class="col-lg-6">
    <div class="demo-section k-content">
        <div id="chart-2"></div>
    </div>
    <script>
        function createChart() {
            var in_work = $('#in_work').val();
            var rezerved_vehicles = $('#rezerved_vehicles').val();
            var active_vehicles = $('#active_vehicles').val();
            var online_res = $('#online_res').val();
            var delayed = $('#delayed').val();
            var today_given = $('#today_given').val();
            var today_back = $('#today_back').val();
            var servis_count = $('#servis_count').val();
            jQuery("#chart").kendoChart({
                legend: {
                   position: "top"
                },
                seriesDefaults: {
                    labels: {
                        template: "#= category # - #= kendo.format('{0:P}', percentage)#",
                        position: "outsideEnd",
                        visible: true,
                        background: "transparent"
                    }
                },
                series: [{
                    type: "pie",
                    data: [{
                        category: "W",
                        value: in_work
                    },{
                        category: "A",
                        value: active_vehicles
                    },{
                        category: "R",
                        value: rezerved_vehicles
                    },{
                        category: "O",
                        value: online_res
                    }]
                }],
                tooltip: {
                    visible: true,
                    template: "#= category # - #= kendo.format('{0:P}', percentage) #"
                }
            });
            jQuery("#chart-2").kendoChart({
                legend: {
                   position: "top"
                },
                seriesDefaults: {
                    labels: {
                        template: "#= category # - #= kendo.format('{0:P}', percentage)#",
                        position: "outsideEnd",
                        visible: true,
                        background: "transparent"
                    }
                },
                series: [{
                    type: "pie",
                    data: [{
                        category: "TG",
                        value: today_given
                    },{
                        category: "TB",
                        value: today_back
                    },{
                        category: "D",
                        value: delayed
                    },{
                        category: "S",
                        value: servis_count
                    }]
                }],
                tooltip: {
                    visible: true,
                    template: "#= category # - #= kendo.format('{0:P}', percentage) #"
                }
            });
        }  

        $(document).ready(function() {
            createChart();
            $(document).bind("kendo:skinChange", createChart);
            $(".box").bind("change", refresh);
        });

        function refresh() {
            var chart = $("#chart").data("kendoChart"),
                pieSeries = chart.options.series[0],
                labels = $("#labels").prop("checked"),
                alignInputs = $("input[name='alignType']"),
                alignLabels = alignInputs.filter(":checked").val();

            chart.options.transitions = false;
            pieSeries.labels.visible = labels;
            pieSeries.labels.align = alignLabels;

            alignInputs.attr("disabled", !labels);

            chart.refresh();
            var chart2 = $("#chart-2").data("kendoChart"),
                pieSeries = chart2.options.series[0],
                labels = $("#labels").prop("checked"),
                alignInputs = $("input[name='alignType']"),
                alignLabels = alignInputs.filter(":checked").val();

            chart2.options.transitions = false;
            pieSeries.labels.visible = labels;
            pieSeries.labels.align = alignLabels;
            alignInputs.attr("disabled", !labels);
            chart2.refresh();
        }
    </script>
    <div class="alert alert-warning">
        TG - {{Lang::get('rentals.today_given')}}<br/>
        TB - {{Lang::get('rentals.today_back')}}<br/>
        D  - {{Lang::get('rentals.delayed')}}<br/>
        S  - Servis
    </div>
    <hr>   
</div>

<div class ="col-lg-12">
    <div class="alert alert-info">
    <i class="fa fa-info-circle"></i> {{Lang::get('rentals.in_work') .': '.$checkOut_count}}<br/>
    <input type="hidden" id="in_work" value ="{{$checkOut_count}}"/>
    
    <i class="fa fa-info-circle"></i> {{Lang::get('rentals.rezerved_vehicles') .': '.$rezerved_count}}</br>
    <input type="hidden" id="rezerved_vehicles" value ="{{$rezerved_count}}"/>
    
    <i class="fa fa-info-circle"></i> {{Lang::get('rentals.active_vehicles') .': '.$checkIn_count}}<br/> 
    <input type="hidden" id="active_vehicles" value ="{{$checkIn_count}}"/>
    
    <i class="fa fa-info-circle"></i> {{Lang::get('rentals.today_given') .': '.$todayGiven_count}}<br/> 
    <input type="hidden" id="today_given" value ="{{$todayGiven_count}}"/>
    
    <i class="fa fa-info-circle"></i> {{Lang::get('rentals.today_back') .': '.$todayBack_count}}<br/> 
    <input type="hidden" id="today_back" value ="{{$todayBack_count}}"/>
    
    <i class="fa fa-info-circle"></i> {{Lang::get('rentals.online') .': '.$online_count}}<br/> 
    <input type="hidden" id="online_res" value ="{{$online_count}}"/>
    
    <i class="fa fa-info-circle"></i> {{Lang::get('rentals.delayed') .': '.$delayed_count}}<br/> 
    <input type="hidden" id="delayed" value ="{{$delayed_count}}"/>
    
    <i class="fa fa-info-circle"></i> Servis: {{$servis_count}}<br/> 
    <input type="hidden" id="servis_count" value ="{{$servis_count}}"/>
    
    <i class="fa fa-info-circle"></i> {{Lang::get('rentals.qira_afatgjate') .': '.$qiraAfatgjate_count}}<br/> 
    <input type="hidden" id="qira_afatgjate" value ="{{$qiraAfatgjate_count}}"/>
    
    <i class="fa fa-info-circle"></i> {{Lang::get('rentals.qira_afatshkurter') .': '.$qiraAfatshkurter_count}}</div> 
    <input type="hidden" id="qira_afatshkurter" value ="{{$qiraAfatshkurter_count}}"/>
    <hr>
</div>
<div class="col-lg-12">
    <div class="box inverse ">
        <header>
            <h5>{{Lang::get('rentals.in_work')}}</h5>
            <div class="toolbar">
                <div class="btn-group">
                    <a href="#stripedTable" data-toggle="collapse" class="btn btn-default btn-sm minimize-box">
                        <i class="fa fa-angle-up"></i>
                    </a> 
                    <a class="btn btn-danger btn-sm close-box">
                        <i class="fa fa-times"></i>
                    </a> 
                </div>
            </div>
        </header>
        <div id="stripedTable" class="body collapse in">
            <table class="table table-striped responsive-table">
                <thead>
                    <tr>
                        <th>{{Lang::get('messages.vehicle')}}</th>
                        <th>{{Lang::get('rentals.nrdays')}}</th>
                        <th>{{Lang::get('rentals.amountpaid')}}</th>
                        <th>{{Lang::get('rentals.gurantee')}}</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($check_out as $co)
                    <tr>
                        <td>{{$co->Make.' '.$co->Model}}</td>
                        <td>{{$co->rentdays}}</td>
                        <td>{{$co->totalpaid.' '.$co->curency}}</td>
                        <td>{{$co->prepaid.' '.$co->curencyg}}</td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
</div>
<div class ="col-lg-12">
    <div class="box inverse">
        <header>
            <h5>{{Lang::get('rentals.today_given')}}</h5>
            <div class="toolbar">
                <div class="btn-group">
                    <a href="#stripedTable" data-toggle="collapse" class="btn btn-default btn-sm minimize-box">
                        <i class="fa fa-angle-up"></i>
                    </a> 
                    <a class="btn btn-danger btn-sm close-box">
                        <i class="fa fa-times"></i>
                    </a> 
                </div>
            </div>
        </header>
        <div id="stripedTable" class="body collapse in">
            <table class="table table-striped responsive-table">
                <thead>
                    <tr>
                        <th>{{Lang::get('messages.vehicle')}}</th>
                        <th>{{Lang::get('rentals.nrdays')}}</th>
                        <th>{{Lang::get('rentals.amountpaid')}}</th>
                        <th>{{Lang::get('rentals.gurantee')}}</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($today_given as $t)
                    <tr>
                        <td>{{$t->Make.' '.$t->Model}}</td>
                        <td>{{$t->rentdays}}</td>
                        <td>{{$t->totalpaid.' '.$t->curency}}</td>
                        <td>{{$t->prepaid.' '.$t->curencyg}}</td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
</div>
<div class ="col-lg-12">
    <div class="box inverse">
        <header>
            <h5>{{Lang::get('rentals.today_back')}}</h5>
            <div class="toolbar">
                <div class="btn-group">
                    <a href="#stripedTable" data-toggle="collapse" class="btn btn-default btn-sm minimize-box">
                        <i class="fa fa-angle-up"></i>
                    </a> 
                    <a class="btn btn-danger btn-sm close-box">
                        <i class="fa fa-times"></i>
                    </a> 
                </div>
            </div>
        </header>
        <div id="stripedTable" class="body collapse in">
            <table class="table table-striped responsive-table">
                <thead>
                    <tr>
                        <th>{{Lang::get('messages.vehicle')}}</th>
                        <th>{{Lang::get('rentals.nrdays')}}</th>
                        <th>{{Lang::get('rentals.amountpaid')}}</th>
                        <th>{{Lang::get('rentals.gurantee')}}</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($today_back as $t)
                    <tr>
                        <td>{{$t->Make.' '.$t->Model}}</td>
                        <td>{{$t->rentdays}}</td>
                        <td>{{$t->totalpaid.' '.$t->curency}}</td>
                        <td>{{$t->prepaid.' '.$t->curencyg}}</td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
</div>
@stop
